import { onMounted, onUnmounted, ref } from 'vue'

function useMousePosition() {
	const x = ref<number>(0)
	const y = ref<number>(0)
	const updateMouse = (event: MouseEvent) => {
		x.value = event.pageX
		y.value = event.pageY
	}
	onMounted(() => {
		document.addEventListener('click', updateMouse)
	})

	onUnmounted(() => {
		document.removeEventListener('click', updateMouse)
	})

	return { x, y }
}

export default useMousePosition
